<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8">
        <title></title>
    </head>
    <body>
        </style>
        <div class="superbox">
            <div class="searchwenzhang">
                <from>
                    标题:<input type="text" class="text"/>
                    分类:<select name="">
                        <option value=""></option>
                        <option value="">xxx</option>
                        <option value="">xxx</option>
                    </select>
                    <button style="background-color: rgba(1, 64, 142, 0.9);">重置</button>
                    <button style="background-color: rgba(1, 170, 255, 0.9);margin-right: 75px;">查询</button>
                </from>
            </div>
            <div class="atriclelist">
                <div class="createwenzhang">
                    <p>文章管理</p>
                    <div class="creat">
                                    <button  style="background-color: rgba(67, 95, 255, 0.8); 
                                                    border: 1px solid transparent;
                                                    outline: none;   
                                                    padding: 10px 10px 10px 10px;
                                                    margin-top: -20px;
                                                    margin-bottom: 20px;
                                                    margin-right: 25px;
                                                    font-weight: bold;
                                                    color: white;
                                                    border-radius: 2.5px;
                                                    transition:0.3s;">
                                                    新建文章
                                    </button>
                    </div>
                </div>
                 <table>
                     <thead>
                <tr style="background-color:rgba(40, 158, 101, 0.6); color:white;" id="onetr">
                    <th style="padding-left:40px;">ID</th>
                    <th style="padding-left:60px;">标题</th>
                    <th>分类</th>
                    <th>创建时间</th>
                    <th>编辑</th>
                    <th>删除</th>
                </tr>
                </thead>
                <tbody id="tdlist">
                </tbody> 
                </table>
                
            </div>
        </div>
    </body>
    <script type="text/javascript">
        $(function(){
            function Article() {
                var url = 'https://yuyoublog.cn/asp/content.asp?admin=Article';
                $.ajax(url, {
                    dataType: 'json',
                    async: false,
                    type: 'get',
                    headers: {
                        'Content-Type': undefined
                    },
                    timeout: 5000,
                    success: function(data) {
                      var Article = data.AdminList
                      var Articlehtml=''
                      $.each(Article, function(i, value) {
                          Articlehtml += `
                               <tr style="background-color: rgba(65, 255, 166, 0.1);">
                                   <td style="padding-left:41px;">${value.id}</td>
                                   <td style="padding-left:60px;"><p class="tdtitle">${value.title}</p></td>
                                   <td>${value.class}</td>
                                   <td>${value.create_date}</td>
                                   <td><button style="background-color:rgba(35, 183, 166, 0.8);">编辑</button></td>
                                   <td><button style="background-color:rgba(255, 0, 0, 0.6);">删除</button></td>
                               </tr>
                         `
                      })
                      $('#tdlist').html(Articlehtml)
                    },
                    error: function(xhr, type, errorThrown) {
                        console.log(errorThrown)
                    }
                });
            }
            Article()
        })
    </script>
</html>

